import type { PropType } from 'vue'

import type { ButtonProps } from 'element-plus'

import { propTypes } from '@/types/propTypes'

export const modalProps = {
  dialogVisible: { type: Boolean },
  title: { type: String, default: '模态框' },
  closeFunc: Function as PropType<() => Promise<boolean>>,
  draggable: propTypes.bool.def(true),
  center: propTypes.bool.def(false),
  alignCenter: propTypes.bool.def(true),
  width: {
    type: [String, Number] as PropType<number | string>,
    default: '40%',
  },
  showClose: propTypes.bool.def(true),
  zIndex: propTypes.number,
}

export const basicProps = {
  ...modalProps,

  cancelText: { type: String, default: '取消' },
  okText: { type: String, default: '确认' },
  cancelButtonProps: {
    type: Object as PropType<Partial<ButtonProps>>,
    default: {
      class: 'px-[30px] h-[40px] mr-[12px] rounded-[6px] ',
    },
  },
  showCancelBtn: { type: Boolean, default: true },
  confirmLoading: { type: Boolean },
  okButtonProps: {
    type: Object as PropType<Partial<ButtonProps>>,
    default: {
      class: 'px-[30px] h-[40px] rounded-[6px]',
      type: 'primary',
    },
  },
  showOkBtn: { type: Boolean, default: true },
  footerClass: propTypes.string.def(' justify-end pr-[16px] mb-[16px]'),
  closeOnClickModal: propTypes.bool.def(false),
}
